Name		Name	Last commit message	Last commit date
parent directory ..
dist		dist
node_modules		node_modules
src		src
.DS_Store		.DS_Store
.babelrc		.babelrc
README.md		README.md
demo.gif		demo.gif
intro.txt		intro.txt
package-lock.json		package-lock.json
package.json		package.json
webpack.config.js		webpack.config.js

README.md

Forkify-It

Functionalities of the App:

Search over 10,000 food items and get their recipes.
Add, Delete and Update the ingredients to your shopping list.
Mark your favorite recipes and access them anytime.
Adjust the ingredients based on the servings.

What I learnt -

Modules in ES6, imports and exports,named and default
The concept of application state, a simple way of implementing state
Advanced DOM manipulation
How to use ES6 template strings to render entire HTML components
Rendering an AJAX loading spinner
How to use .closest method for easier event handling
How and why to use data-* attributes in HTML 5
Pagination
how to read data from the page URL
how to respond to the haschange event
how to add the same event listener to multiple events
Using array methods like map,slice,findIndex and includes
how and why to use eval()
Implementing event delegation through '.matches'
Creating unique IDs using an external package
Difference between array.slice and array.splice
use case for array.findIndex() and array.find()
loacl Storage API

Demo of the app -